<template>
    <el-dialog :title="title" :visible.sync="visible" width="35%" :before-close="beforeClose">
        <el-form :model="newForm" ref="depForm" :rules="depRules" label-width="120px">
            <el-form-item label="数据字典标题" prop="title">
                <el-input v-model="newForm.title" placeholder="请输入数据字典标题"/>
            </el-form-item>
            <el-form-item label="数据字典编号" prop="sn">
                <el-input v-model="newForm.sn" placeholder="请输入数据字典编号"/>
            </el-form-item>
            <el-form-item label="数据字典简介" prop="intro">
                <el-input v-model="newForm.intro" placeholder="请输入数据字典简介"/>
            </el-form-item>
        </el-form>
        <div class="dialog-footer" slot="footer">
            <el-button type="primary" @click="saveDep()">保存</el-button>
            <el-button @click="beforeClose()">取消</el-button>
        </div>
    </el-dialog>
</template>

<script>
    import {addSysDictionariesApi, updateSysDictionariesApi} from '@/request/api'

    export default {
        name: "SysDialog",
        props: {
            title: {
                type: String,
                default: ''
            },
            visible: {
                type: Boolean,
                default: false
            },
            formData: {
                type: Object,
                default: {}
            },
            sysId: {
                type: Number
            }
        },
        data() {
            return {
                depRules: {
                    title: [
                        {required: true, message: '请输入数据字典标题', trigger: 'blur'}
                    ],
                    sn: [
                        {required: true, message: '请输入数据字典编号', trigger: 'blur'}
                    ],
                    intro: [
                        {required: true, message: '请输入数据字典简介', trigger: 'blur'}
                    ]
                },
                newForm: {},
            }
        },
        watch: {
            formData(val) {
                if (!val) return
                this.$set(this, 'newForm', {...val});
            }
        },
        methods: {
            beforeClose() {
                this.$refs['depForm'].resetFields()
                this.$emit('closeDialog')
            },
            saveDep() {
                this.$refs['depForm'].validate(valid => {
                    if (valid) {
                        if (this.title === '数据字典添加') {
                            addSysDictionariesApi({
                                title: this.newForm.title,
                                intro: this.newForm.intro,
                                sn: this.newForm.sn
                            }).then(res => {
                                if (res.success === true) {
                                    this.$refs['depForm'].resetFields()
                                    this.$emit('closeDialog', true)
                                }
                            })
                        } else if (this.title === '数据字典编辑') {
                            updateSysDictionariesApi({
                                id: this.sysId,
                                title: this.newForm.title,
                                intro: this.newForm.intro,
                                sn: this.newForm.sn
                            }).then(res => {
                                if (res.success === true) {
                                    this.$refs['depForm'].resetFields()
                                    this.$emit('closeDialog', true)
                                }
                            })
                        }

                    } else {
                        return false
                    }
                })
            },
        }
    }
</script>

<style scoped>

</style>